<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<title>交易汇总</title>
		<link rel="stylesheet" href="__AGENT__/css/iconfont.css" />
		<link rel="stylesheet" href="__AGENT__/css/css.css" />
		<script src="__PUBLIC__/static/lib/echarts.min.js"></script>
	</head>

	<body>
		{include file="public/header" /}
		<div class="index_conbox">
			<div class="index_content clearfix">
				{include file="public/lefter" /}
				<div class="right">
					<div class="rigtop">
						<span class="title">交易汇总</span>
					</div>
					<div class="indrig_con">
						<div class="huizcx_top">
							<div class="tongjbb_box">
								<div class="tongjititle">
									<p>统计报表</p>
								</div>
								<div class="tongji_typelist clearfix">
									<div class="tongji_typeitem" id="alipay">
										<p class="tongji_type">会员(个)</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">今日<em style="color: red;margin-left: 5px;">{$today_mems}</em></span>
										</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">本周<em style="color: red;margin-left: 5px;">{$week_mems}</em></span>
										</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">本月<em style="color: red;margin-left: 5px;">{$month_mems}</em></span>
										</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">累计<em style="color: red;margin-left: 5px;">{$mems}</em></span>
										</p>
									</div>
										<div class="tongji_typeitem" id="alipay">
										<p class="tongji_type">交易流水(￥)</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">今日<em style="color: red;margin-left: 5px;">{$today_logs}</em></span>
										</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">本周<em style="color: red;margin-left: 5px;">{$week_logs}</em></span>
										</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">本月<em style="color: red;margin-left: 5px;">{$month_logs}</em></span>
										</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">累计<em style="color: red;margin-left: 5px;">{$logs}</em></span>
										</p>
									</div>
												
									<div class="tongji_typeitem" id="wechat">
										<p class="tongji_type">交易笔数(笔)</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">今日<em style="color: red;margin-left: 5px;">{$today_counts}</em></span>
										</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">本周<em style="color: red;margin-left: 5px;">{$week_counts}</em></span>
										</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">本月<em style="color: red;margin-left: 5px;">{$month_counts}</em></span>
										</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">累计<em style="color: red;margin-left: 5px;">{$counts}</em></span>
										</p>
									</div>
									<div class="tongji_typeitem" id="alipay-bank">
										<p class="tongji_type">鼓励金</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">今日<em style="color: red;margin-left: 5px;">赠送{$today_scores}</em><em style="color: red;margin-left: 5px;">回收{$today_scores1}</em></span>
										</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">本周<em style="color: red;margin-left: 5px;">赠送{$week_scores}</em><em style="color: red;margin-left: 5px;">回收{$week_scores1}</em></span>
										</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">本月<em style="color: red;margin-left: 5px;">赠送{$month_scores}</em><em style="color: red;margin-left: 5px;">回收{$month_scores1}</em></span>
										</p>
										<p class="tongji_typribox">
											<span class="tongji_typri">累计<em style="color: red;margin-left: 5px;">赠送{$total_scores}</em><em style="color: red;margin-left: 5px;">回收{$total_scores1}</em></span>
										</p>
									</div>
								</div>

							</div>
							<div id="main" style="height:400px; margin-top: 40px;"></div>
							<script type="text/javascript">
								// 基于准备好的dom，初始化echarts实例
								var mp = {
									$mp
								};
								var myChart = echarts.init(document.getElementById('main'));
								option = {
									title: {
										text: '交易数据分析',
										x: 'center'
									},
									tooltip: {
										trigger: 'item',
										formatter: "{a} <br/>{b} : {c} ({d}%)"
									},
									toolbox: {
										show: true,
										feature: {
											mark: {
												show: true
											},
											saveAsImage: {
												show: true
											}
										}
									},
									calculable: true,
									series: [

										{
											name: '面积模式',
											type: 'pie',
											radius: [20, 160],
											center: ['50%', '50%'],
											roseType: 'area',
											data: [{
												value: mp.sm,
												name: '扫码支付'
											}, {
												value: mp.sc,
												name: '商城交易'
											}, {
												value: mp.jz,
												name: '记账'
											}]
										}
									]
								};

								// 使用刚指定的配置项和数据显示图表。
								myChart.setOption(option);
							</script>

						</div>
					</div>
				</div>
			</div>

			{include file="public/footer" /}
	</body>

</html>
<script>
	layui.use('laydate', function() {
		var laydate = layui.laydate;

		//日期控件
		laydate.render({
			elem: '#begin_time',
			type: 'datetime',
			format: 'yyyy-MM-dd HH:mm:ss'
		});

		laydate.render({
			elem: '#end_time',
			type: 'datetime',
			format: 'yyyy-MM-dd HH:mm:ss'
		});
	})
</script>